.detail {
    display: flex;

    :global {
        .list-left {
            width: 30%;
            display: flex;
            justify-content: center;
            min-width: 250px;
        }

        .image > img {
            height: 240px;
            width: 240px;
            padding: 5px;
            border: 1px solid #bbb;
        }

        .list-right {
            width: 70%;
        }

        .title-playlist,
        .title-album,
        .title-song {
            font-size: 20px;
            font-weight: 600;
            &::before {
                color: #c62f2f;
                font-size: 14px;
                border: 1px solid #c62f2f;
                padding: 2px 5px;
                margin-right: 10px;
            }
        }

        .title-playlist::before {
            content: "歌单";
        }

        .title-album::before {
            content: "专辑";
        }

        .title-song::before {
            content: "单曲";
        }

        .btns {
            margin: 16px 0;
        }

        .creator {
            display: flex;
            height: 40px;
            line-height: 40px;
            margin: 10px 0;
            font-size: 12px;
            color: #bbb;

            & > a {
                margin-right: 15px;
                font-size: 14px;
                &:hover {
                    text-decoration: underline;
                }
            }

            img {
                height: 40px;
                width: 40px;
                margin-right: 15px;
                border-radius: 5px;
            }
        }

        .tags > span {
            padding: 5px 8px;
            margin-right: 10px;
            font-size: 12px;
            color: #fff;
            border-radius: 5px;
            &:nth-of-type(1) {
                background-color: #22c36a;
            }
            &:nth-of-type(2) {
                background-color: #df7643;
            }
            &:nth-of-type(3) {
                background-color: #b667fc;
            }
            &:nth-of-type(4) {
                background-color: #e5a634;
            }
            &:nth-of-type(5) {
                background-color: #f46ca2;
            }
        }

        .singer span:nth-last-of-type(1) {
            display: none;
        }

        .lyric {
            overflow: hidden;
        }

        .toggle + .lyric {
            max-height: 300px;

            & + label::after {
                cursor: pointer;
                color: #007acc;
                content: "展开";
            }
        }

        .toggle:checked + .lyric {
            max-height: unset;

            & + label::after {
                cursor: pointer;
                color: #007acc;
                content: "收起";
            }
        }

        .description {
            color: #666;
            white-space: pre-wrap;
        }
    }
}
